<%--
  Created by IntelliJ IDEA.
  User: 71027
  Date: 2019/5/13
  Time: 19:44
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>





<%--head部分。--%>
<head>
    <title>外层框架</title>





    <%--需要导入的文件。【都放在。${pageContext.request.contextPath}/mytest下了。】--%>
    <%--也可以识别了。即使在。【webapp】其他文件夹下。【WEB-INF外面。供WEB-INF下的JSP下的jsp页面调用。】--%>

    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/mytest/static/css/font.css"
          charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/mytest/static/css/weadmin.css"
          charset="UTF-8">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/mytest/lib/layui/css/layui.css"
          charset="UTF-8">
    <%--把index里面的东西弄过来。所有的外部框架文件。【？？？】--%>
    <script type="text/javascript" src="${pageContext.request.contextPath}/mytest/lib/layui/layui.js"
            charset="utf-8"></script>

    <script type="text/javascript" src="${pageContext.request.contextPath}/mytest/static/js/admin.js"
            charset="utf-8"></script>

    <link rel="shortcut icon" href="./favicon.ico" type="image/x-icon"/>
</head>




<%--body部分。--%>
<body>





<%--【顶部。】--%>
<div class="container"><!--顶部。-->
    <div class="logo">
        <a href="./index.html">宠物管理系统 v1.0</a><!--跳转。-->
    </div>
    <div class="left_open">
        <i title="展开左侧栏" class="iconfont">&#xe699;</i>
    </div>
    <ul class="layui-nav left fast-add" lay-filter=""><!--？？lay-filter又是什么？？？【】-->
        <li class="layui-nav-item">
            <a href="javascript:;">+新增</a><!--点击触发JS的a标签。【好看？】-->
            <dl class="layui-nav-child"><!--自定义列表？？【？】-->
                <dd>
                    <a onclick="WeAdminShow('资讯','https://www.youfa365.com/')">
                        <i class="iconfont">&#xe6a2;</i>资讯
                    </a>
                </dd>
                <dd>
                    <a onclick="WeAdminShow('图片','http://www.baidu.com')">
                        <i class="iconfont">&#xe6a8;</i>图片
                    </a>
                </dd>
                <dd>
                    <a onclick="WeAdminShow('用户','https://www.youfa365.com/')">
                        <i class="iconfont">&#xe6b8;</i>用户
                    </a>
                </dd>
            </dl>
        </li>
    </ul>
    <ul class="layui-nav right" lay-filter=""><!--无序列表，右侧。（两个按的。）[class]-->

        <li class="layui-nav-item"><!--这是什么样式表？【？】-->

            <a href="javascript:;">Admin</a><!--调用了啥？【百度。】【自己写好的？？？】-->
            <dl class="layui-nav-child"><!--这究竟是什么？？？【】-->
                <dd>
                    <a onclick="WeAdminShow('个人信息','http://www.baidu.com')">个人信息</a>
                </dd>
                <dd>
                    <a onclick="WeAdminShow('切换帐号','./login.html')">切换帐号</a>
                </dd>
                <dd>
                    <a class="loginout" href="index">退出</a>
                </dd>
            </dl>
        </li>
        <li class="layui-nav-item to-index"><!--[?]-->
            <a href="/Github_war_exploded/user/index">前台首页</a>
        </li>
    </ul>
</div>








<!-- 左侧菜单 -->
<div class="left-nav">
    <!--左侧div【整个背景。】-->
    <div id="side-nav">
        <!--包了两层div？【有列表的那部分。】-->

        <!--谷歌显示了所有作用到的style CSS厉害。所有有关的。-->

        <ul id="nav">
            <!--里面放了一个ul。作为导航？【】-->
            <li>
                <a href="javascript:;">
                    <i class="iconfont">&#xe6b8;</i>
                    <cite>用户管理</cite>
                    <i class="iconfont nav_right">&#xe697;</i>
                    <!--调用复合CSS？？？【可以。】【这里调用，空格表示两个都适用？？【】】-->
                </a>

                <ul class="sub-menu"><!--二级菜单。【】-->
                    <li>
                        <a _href="./pages/member/list.html">
                            <i class="iconfont">&#xe6a7;</i>
                            <cite>会员列表</cite>
                        </a>
                    </li>
                    <li>
                        <a _href="./pages/member/del.html">
                            <i class="iconfont">&#xe6a7;</i>
                            <cite>会员删除</cite>
                        </a>
                    </li>
                    <li><!--这个复杂？【三级？】-->
                        <a href="javascript:;">
                            <i class="iconfont">&#xe70b;</i>
                            <cite>会员管理</cite>
                            <i class="iconfont nav_right">&#xe697;</i>
                        </a>
                        <ul class="sub-menu"><!--无序列表？？三级菜单？【三层无序？还是啥？】-->
                            <li>
                                <a _href="./pages/member/addInput.html">
                                    <i class="iconfont">&#xe6a7;</i>
                                    <cite>输入框操作</cite>
                                </a>
                            </li>
                            <li>
                                <a _href="./pages/404.html">
                                    <i class="iconfont">&#xe6a7;</i>
                                    <cite>三级菜单演示</cite>
                                </a>
                            </li>
                            <li>
                                <a _href="./pages/404.html">
                                    <i class="iconfont">&#xe6a7;</i>
                                    <cite>导航菜单演示</cite>
                                </a>
                            </li>
                        </ul>
                    </li>
                </ul>
            </li>
            <li><!--无序列表的子元素。【】-->
                <a href="javascript:;"><!--【子元素，里面放a标签】（图文。多个图标。）-->
                    <!--但调用JS，不调用网页。这就是区别？【如何网页放在那里面？？【】】-->
                    <!--触发了什么事件？？【】-->
                    <i class="iconfont">&#xe705;</i>
                    <cite>商店管理</cite>
                    <i class="iconfont nav_right">&#xe697;</i>
                </a>
                <ul class="sub-menu"><!--无序列表包围。-->
                    <li>
                        <%--调用商店页面。--%>
                        <a _href="http://localhost:8080/Github_war_exploded/store/allstore">
                        <%--<a _href="./store/allstore">--%>
                            <i class="iconfont">&#xe6a7;</i>
                            <cite>商店列表</cite>
                            <%--延迟？？？--%>
                        </a>
                    </li>
                    <li>
                        <a _href="./pages/article/category.html">
                            <i class="iconfont">&#xe6a7;</i>
                            <cite>分类管理</cite>
                        </a>
                    </li>
                </ul>
            </li>
            <li>
                <a href="javascript:;">
                    <i class="iconfont">&#xe723;</i>
                    <cite>宠物管理</cite>
                    <i class="iconfont nav_right">&#xe697;</i>
                </a>
                <ul class="sub-menu"><!--子标签里面的。不展示。-->
                    <li><!--下面一个a标签，导航。-->
                        <a _href="./pages/order/list.html"><!--复合型a标签。-->
                            <i class="iconfont">&#xe6a7;</i><!--图-->
                            <cite>宠物列表</cite><!--文。-->
                        </a>
                    </li>
                </ul>
            </li>
            <li>
                <a href="javascript:;">
                    <i class="iconfont">&#xe723;</i>
                    <cite>交易管理</cite>
                    <i class="iconfont nav_right">&#xe697;</i>
                </a>
                <ul class="sub-menu"><!--子标签里面的。不展示。-->
                                        <li><!--下面一个a标签，导航。-->
                        <a _href="./pages/order/list.html"><!--复合型a标签。-->
                            <i class="iconfont">&#xe6a7;</i><!--图-->
                            <cite>订单列表</cite><!--文。-->
                        </a>
                    </li>
                </ul>
            </li>
            <li>
                <!--子元素。但是可以显示在无序列表中，最外层。【】-->

                <a href="javascript:;">
                    <!--调用的什么？？展开和？？【展合。】-->
                    <i class="iconfont">&#xe726;</i><!--图标？-->
                    <cite>管理员管理</cite><!--文字？？-->
                    <i class="iconfont nav_right">&#xe697;</i><!--图标？-->
                </a>
                <ul class="sub-menu">
                    <!--子标签，默认不显示。【display: none;】-->

                    <!--子标签页？？？【子标签页都这么多内容？？（图标，超链接。）】-->
                    <li>
                        <a _href="./pages/admin/list.html">
                            <i class="iconfont">&#xe6a7;</i>
                            <cite>管理员列表</cite>
                        </a>
                    </li>
                    <li>
                        <a _href="./pages/admin/role.html">
                            <i class="iconfont">&#xe6a7;</i>
                            <cite>角色管理</cite>
                        </a>
                    </li>
                    <li>
                        <a _href="./pages/admin/cate.html">
                            <i class="iconfont">&#xe6a7;</i>
                            <cite>权限分类</cite>
                        </a>
                    </li>
                    <li>
                        <a _href="./pages/admin/rule.html"><!--网页资源。【收集。】-->
                            <i class="iconfont">&#xe6a7;</i><!--图标资源。【收集。】-->
                            <cite>权限管理</cite>
                        </a>
                    </li>
                </ul>
            </li>
            <li>
                <a href="javascript:;">
                    <!--这个是调用JS的。这个标签的内容？？？【以及需要展开下面的。】-->
                    <!--怎么调用的？？？【？？】-->
                    <!--是a标签。-->

                    <i class="iconfont">&#xe6ce;</i><!--图标？【？？】-->
                    <cite>系统统计</cite><!--文字。-->
                    <i class="iconfont nav_right">&#xe697;</i><!--图标？【？？】-->
                </a>

                <ul class="sub-menu">
                    <!--li里面嵌套放了一个ul无序列表。无序列表的嵌套。-->
                    <li>
                        <a _href="./pages/echarts/echarts1.html"><!--跳到新页面？
								【即可。看这些页面怎么写的即可。】-->
                            <!--全放的a标签，用来转？跳转？即可？【】-->
                            <i class="iconfont">&#xe6a7;</i>
                            <!--图标（导入一个文字的文字？？？）得有。【导入？？？】-->
                            <!--使用这个字体CSS，即可。-->
                            <cite>拆线图</cite><!--文字。【？？】-->
                        </a>
                    </li>
                </ul>
            </li>
        </ul>
    </div>
</div><!--左侧div结束。-->
<!-- <div class="x-slide_left"></div> -->



<%--右侧内容区域。【】--%>
<div class="page-content">
    <!--内容区。-->
    <div class="layui-tab tab" lay-filter="wenav_tab" id="WeTabTip" lay-allowclose="true">
        <!--整个？【】-->
        <ul class="layui-tab-title" id="tabName">
            <!--【】管他的，反正可以自动生成。点击左边按钮即可。【虽然不知道为什么？？】【待会儿看左边按钮的单击事件。JS？】-->

            <!--【id可以被操作。】-->
            <!--这是标签栏？【有id可以被JS操控。】难道是因为class的原因？？-->
            <!--明明没有-->
            <li>我的桌面</li>
            <!--<i class="layui-icon layui-unselect layui-tab-close">ဆ</i>【关闭按钮。】-->
            <!--这里明明没有那个啊。【？？？？】【这个应该在li里面的？？】-->
            <!--ul是什么？无序列表？li是什么？元素？【。】-->


            <!--【一个标签。】<li lay-id="10"【有id】 class="layui-this" data-bit="1"【这是什么？】>分类管理【文字。】
            <i class="layui-icon layui-unselect layui-tab-close">ဆ</i>【关闭按钮。】
            </li>-->
            <!--当前显示有::after这个东西。看CSS？【.layui-tab-title .layui-this:after {】-->
        </ul>
        <div class="layui-tab-content"><!--这就是内容区域了。-->
            <div class="layui-tab-item layui-show"><!--多个div，可以相互切换样式，
					layui-tab-item layui-show和layui-tab-item两者切换。-->
                <!--这个【div就是用的layui.css里面的？也就是多层跨界调用？【】】-->
                <iframe src='http://localhost:8080/Github_war_exploded/welcome' frameborder="0" scrolling="yes" class="weIframe"></iframe>
                <%--测试欢迎界面。--%>
                <!--div里面放了一个其他页面。新页面？【】-->
            </div>
            <!--其他iframe貌似有tab-id。
            此外，src不同，其他都相同。-->
        </div>
    </div>
</div>





<%--右侧内容区域背景【有用吗？？？】--%>
<div class="page-content-bg"></div>
<!--有了，貌似是背景图。在右侧页面区的，看style才知道。【谷歌，实时调控CSS，还有编辑html代码。都可以。】-->






<div class="footer">
    <!--底部footer的div【ok】-->
    <div class="copyright">Copyright ©2019 宠物管理系统 v1.0 All Rights Reserved</div>
    <!--class格式。-->
</div><!--底部结束。-->






<!--js代码开始？？？【是干嘛的？？？？】【JS调用JS？】-->
<script type="text/javascript">
    /*JS就调用了其他的函数【layui.js=虽然不知道是什么用？？？】*/

    //			layui扩展模块的两种加载方式-示例
    //		    layui.extend({
    //			  admin: '{/}../../static/js/admin' // {/}的意思即代表采用自有路径，即不跟随 base 路径
    //			});
    //			//使用拓展模块【大哥，什么意思啊。】
    //			layui.use('admin', function(){
    //			  var admin = layui.admin;
    //			});


    layui.config({
        base: './static/js/'
        , version: '101100'
    }).use('admin');
    /*底层解析？？？【】*/

    /*这里传入的参数是ajax？？？？【】*/
    /*调用use函数？【】*/

    /*这是什么东西？？todo 测试一下？？？*/

    layui.use(['jquery', 'admin'], function () {
        /*这个函数调用现在根本看不懂。【。。。。什么意思啊？干嘛了？？什么时候执行的？】*/
        /*貌似登陆时就执行了。一开始？？【】*/

        var $ = layui.jquery;
        /*有什么用？没有注释？【？】*/
        $(function () {
            var login = JSON.parse(localStorage.getItem("login"));
            /*获取本地登陆状态？？【】*/
            /*这就是所谓的localStorage.getItem("login")即可。【？？】*/
            if (login) {
                if (login = 0) {
                    // window.location.href = './login.html';
                    // /*先注释。*/
                    /*这里有一个自动跳转？【why？】*/
                    return false;
                } else {
                    return false;
                }
            } else {
                // window.location.href = './login.html';
                /*这种情况也跳转？什么意思啊？*/
                return false;
            }
        });
    });
    /*这个函数究竟什么用？？？【底层JS？？？或者解析？？？（）】*/
</script>


<%--加一个右键菜单。调用框架内部东西。【？】--%>


</body>
<ul class="rightMenu" id="rightMenu">
    <%--这里使用了这个class【以及有一个id，可以外部JS操作。（）】--%>

    <li data-type="fresh">刷新</li>
    <li data-type="current">关闭当前</li>
    <li data-type="other">关闭其它</li>
    <li data-type="all">关闭所有</li>
</ul>
</html>
